@media(min-width:0){
    .container{
        width:100%;
        
    }
}
@media(min-width:768px){
    .container{
        width:100%;
        
    }
}
@media(min-width:992px){
    .container{
        width:100%;
        
    }
}
@media(min-width:1200px){
    .container{
        width:100%;
        
    }
}

*{
    padding:0px;
    margin:0px;
}
body{
    position:relative;
    font:16px 'Microsoft YaHei',sans-serif;
}

ul{
    list-style:none;
}

.nav{
    background-color:black;
    padding-right:0px;
    font:16px 'Microsoft YaHei',sans-serif;
    float:left;
    width:200px;
    height:500px;
   
}
.nav ul li{
    
    width:100%;
}
.nav ul li a:hover{
    border-left:5px solid dodgerblue;
    box-sizing:border-box;
}   
.nav ul li a{
    display:block;
    position:relative;
    text-decoration:none;
    height:56px;
    padding-left:25px;
    /* 要放到font-size的下面才会生效 */
    line-height:56px;
    color:white;
    border:5px solid black;
    box-sizing: border-box;
    /* opacity: 0.8; */
}


.nav cite{
    margin-left:5px;
    font-style:normal;
}
.nav li span.box{
    display:inline-block;
}
.nav i.toggle{
    position:absolute;
    right:15px;
    margin-top:20px;
}
.top{
    display:none;
}
.bottom{
    display:none;
}
.current{
    display:none;
}

.move1{
    transform:translateX(-240px);
    transition:all .5s linear;
    width:100%;
} 
.move2{
    transform:translateX(0px);
    transition:all .5s linear;
    width: calc(100% - 240px);
}
/* .widthen{
    width:100%;
} */
.box-right{
    position:absolute;
    left:200px;
    right:0px;
}
.header{
    height:50px;
    text-align:center;
    background-color:grey;
    
}
.header ul{
    padding:0 10px;
    line-height:50px;
}
/* .box-right .header ul li{
    width:20px;
} */
.header ul .menu{
    padding:0px 10px;
    width:40px;
}
.cancel1{
    transform:translateX(-240px);
    transition:all .5s linear;
   
}
.cancel2{
    transform:translateX(0px);
    transition:all .5s linear;
   
}

.header ul li:hover{
    border-top:2px solid grey;
}
.header ul li a{
    color:black;
    text-decoration:none;
}
 cite{
    font-style:normal;
}
.header ul li .current2{
    display:none;
}
.header ul li:nth-child(3):hover{
    display:block;
}
.right-bottom-box .key{
    background:rgb(54, 109, 209);
    padding-left:10px;
    height:10px;
    
}
.right-bottom-box .file{
    background:red;
    height:10px;
    padding-left:10px;
}



